<html lang="UTF-8" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title>基顶模量计算</title>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.10.0.js"></script>
    <style>
        table.dataintable {
            margin-top:15px;
            border-collapse:collapse;
            border:1px solid #aaa;
            width:100%;
        }
        table.dataintable th {
            vertical-align:baseline;
            padding:5px 15px 5px 6px;
            background-color:#3F3F3F;
            border:1px solid #3F3F3F;
            text-align:left;
            color:#fff;
        }
        table.dataintable td {
            vertical-align:text-top;
            padding:6px 15px 6px 6px;
            border:1px solid #aaa;
        }
        table.dataintable tr:nth-child(odd) {
            background-color:#F5F5F5;
        }
        table.dataintable tr:nth-child(even) {
            background-color:#fff;
        }
    </style>

</head>

<body>
    <table class="dataintable">
        <tr>
            <th>输入项</th>
            <th></th>
            <th></th>
        </tr>
        <tr>
            <th>输入参数名</th>
            <th>输入参数值</th>
            <th>输入参数单位及限制</th>
        </tr>
        <tr>
            <td><i>道路等级:</i></td>
            <td>
                <select id="roadgrade" name="roadgrade" required="required">
                <option value="0">高速道路</option>
                <option value="1">一级道路</option>
                <option value="2">其它道路</option>
                </select>
            </td>
            <td></td>
        </tr>
        <tr>
            <td><i>道面平整度值σ:</i></td>
            <td><input type="text" id="roadflatness" required="required"/></td>
            <td></td>
        </tr>
        <tr>
            <td><i>行车速度v:</i></td>
            <td><input type="text" id="drivingspeed" required="required"/></td>
            <td>(单位：m/s)</td>
        </tr>
        <tr>
            <td><i>设计容许弯沉:</i></td>
            <td><input type="text" id="designallowdef" required="required"/></td>
            <td>(单位：mm)</td>
        </tr>
        <tr>
            <td><i>距离轮胎外侧的距离:</i></td>
            <td><select id="disouttireenum" name="disouttireenum" required="required">
                <option value="0.4">0.4m</option>
                <option value="0.6">0.6m</option>
                <option value="0.8">0.8m</option>
            </select></td>
            <td></td>
        </tr>
        <tr>
            <td><i>面层厚度hc</i></td>
            <td><select id="surfacethickness" name="surfacethickness" required="required">
                <option value="0.14">0.14</option>
                <option value="0.15">0.15</option>
                <option value="0.16">0.16</option>
                <option value="0.17">0.17</option>
                <option value="0.18">0.18</option>
                <option value="0.19">0.19</option>
                <option value="0.20">0.20</option>
                <option value="0.21">0.21</option>
                <option value="0.22">0.22</option>
                <option value="0.23">0.23</option>
                <option value="0.24">0.24</option>
                <option value="0.25">0.25</option>
                <option value="0.26">0.26</option>
                <option value="0.27">0.27</option>
                <option value="0.28">0.28</option>
                <option value="0.29">0.29</option>
                <option value="0.30">0.30</option>
            </select></td>
            <td>0.14m≤ (数值) ≤0.30m(单位：m)</td>
        </tr>
        <tr>
            <td><i>面层模量Ec</i></td>
            <td><input id="surfacemodulus" type="text" required="required"/></td>
            <td>500MPa≤ (数值) ≤6000MPa (单位：MPa)</td>
        </tr>
        <tr>
            <td><i>实测值</i></td>
            <td></td>
            <td></td>
        </tr>
        <tr>
            <td><i>弯沉s</i></td>
            <td><input id="deflection" type="text"/></td>
            <td>(单位：mm)</td>
        </tr>
        <tr>
            <td><i>应变ε</i></td>
            <td><input id="strain" type="text"/></td>
            <td>(单位：με)</td>
        </tr>
        <tr>
            <td><i>频率f</i></td>
            <td><input id="frequency" type="text" required="required"/></td>
            <td>(单位：Hz)</td>
        </tr>
        <tr>
            <td><i></i></td>
            <td><input id="submit" type="button" value="计算" /></td>
            <td></td>
        </tr>
        <tr>
            <th>输出项</th>
            <th></th>
            <th></th>
        </tr>
        <tr>
            <td><i>基顶当量回弹模量实测值</i></td>
            <td><label id="labelA11" /></td>
            <td>(单位：MPa)</td>
        </tr>
        <tr>
            <td><i>SSI</i></td>
            <td><label id="labelA21" /></td>
            <td>(单位：1)</td>
        </tr>
        <tr>
            <td><i>PSSI</i></td>
            <td><label id="labelA31" /></td>
            <td>(单位：1)</td>
        </tr>
        <tr>
            <td><i>SSI道路等级</i></td>
            <td><label id="labelA41" /></td>
            <td></td>
        </tr>
        <tr>
            <td><i>PSSI道路等级</i></td>
            <td><label id="labelA51" /></td>
            <td></td>
        </tr>
    </table>

</div>

</body>
</html>
<script type="text/javascript">
    $("#submit").click(function() {
        var surfacemodulus=document.getElementById("surfacemodulus").value;
        if (surfacemodulus<500 || surfacemodulus>6000) {
            alert("面层模量Ec输入非法")
            return;
        }


        $.ajax({
            url: "http://localhost:8091/zc/api/topmodcal.do",
            type: "post",
            contentType: "application/json",
            dataType:"jsonp",
            data: JSON.stringify({
                "roadGradeEnum": document.getElementById("roadgrade").value,
                "roadFlatness": document.getElementById("roadflatness").value,
                "drivingSpeed": document.getElementById("drivingspeed").value,
                "designAllowDef": document.getElementById("designallowdef").value,
                "disOutTireEnum": document.getElementById("disouttireenum").value,
                "surfaceThickness": document.getElementById("surfacethickness").value,
                "surfaceModulus": document.getElementById("surfacemodulus").value,
                "deflection": document.getElementById("deflection").value,
                "strain": document.getElementById("strain").value,
                "frequency": document.getElementById("frequency").value
            }),
            success: function(data) {
                var dataJson = JSON.parse(data);
                $("#labelA11").val(dataJson.reboundModMeaVal);
                $("#labelA21").val(dataJson.ssi);
                $("#labelA31").val(dataJson.pssi);
                $("#labelA41").val(dataJson.roadSsiEvaLevelEnum);
                $("#labelA51").val(dataJson.roadPssiEvaLevelEnum);
            },
            error:function(data){
                var dataJson = JSON.parse(data.responseText);
                $("#labelA11").html(dataJson.reboundModMeaVal);
                $("#labelA21").html(dataJson.ssi);
                $("#labelA31").html(dataJson.pssi);
                $("#labelA41").html(dataJson.roadSsiEvaLevelEnum);
                $("#labelA51").html(dataJson.roadPssiEvaLevelEnum);
            }
        });
    });
</script>
